import App from "../App.vue";
import router from "./router";
import { setupStore } from "@/store";
import { getPlatformConfig } from "./config";
import { MotionPlugin } from "@vueuse/motion";
import { useEcharts } from "@/plugins/echarts";
import { createApp, type Directive } from "vue";
import { useElementPlus } from "@/plugins/elementPlus";
import { injectResponsiveStorage } from "@/utils/responsive";
import "video.js/dist/video-js.css"
import Table from "@pureadmin/table";
// import PureDescriptions from "@pureadmin/descriptions";

// 引入重置样式
import "./style/reset.scss";
// 导入公共样式
import "./style/index.scss";
// 一定要在main.ts中导入tailwind.css，防止vite每次hmr都会请求src/style/index.scss整体css文件导致热更新慢的问题
import "./style/tailwind.css";
import "./style/sj-theme.scss"; //自定义主题
// import "element-plus/dist/index.css";
// 导入字体图标
import "./assets/iconfont/iconfont.js";
import "./assets/iconfont/iconfont.css";
// 导入字体图标
import "./assets/ali-icon/iconfont.js";
import "./assets/ali-icon/iconfont.css";

import './style/data-dashboard.scss'

import 'echarts-liquidfill'
import "go-captcha-vue/dist/style.css"
import GoCaptcha from "go-captcha-vue"

const app = createApp(App);
app.config.warnHandler = () => null;
// 自定义指令
import * as directives from "@/directives";
Object.keys(directives).forEach(key => {
  app.directive(key, (directives as { [key: string]: Directive })[key]);
});

// 全局注册@iconify/vue图标库
import {
  IconifyIconOffline,
  IconifyIconOnline,
  FontIcon
} from "./components/ReIcon";
app.component("IconifyIconOffline", IconifyIconOffline);
app.component("IconifyIconOnline", IconifyIconOnline);
app.component("FontIcon", FontIcon);

// 全局注册按钮级别权限组件
import { Auth } from "@/components/ReAuth";
app.component("Auth", Auth);
//地图相关
import VueAMap, { initAMapApiLoader } from '@vuemap/vue-amap';
import '@vuemap/vue-amap/dist/style.css'
initAMapApiLoader({
  key: 'bd0a7fa11576067d48ee74a59871defe',
  securityJsCode: "35ab3b23605bab40ce32b6318072af91",
  plugins: ["AMap.PlaceSearch", "AMap.PolygonEditor"]
});
import SjButton from "@/components/SjButton";
import SjLink from "@/components/SjLink";
import formCreate from "@form-create/element-ui";

// 全局注册vue-tippy
import "tippy.js/dist/tippy.css";
import "tippy.js/themes/light.css";
import VueTippy from "vue-tippy";
app.use(VueTippy);

import { ColorPicker as TColorPicker } from 'tdesign-vue-next';

// 引入组件库的少量全局样式变量
import 'tdesign-vue-next/es/style/index.css';

getPlatformConfig(app).then(async config => {
  setupStore(app);
  app.use(router);
  await router.isReady();
  injectResponsiveStorage(app, config);
  app
    .use(MotionPlugin)
    .use(useElementPlus)
    .use(Table)
    .use(SjButton)
    .use(SjLink)
    .use(TColorPicker)
    .use(formCreate)
    .use(useEcharts)
    .use(GoCaptcha);
  app.mount("#app");
});



if (JSON.parse(localStorage.getItem("responsive-layout"))?.darkMode) {
  document.getElementById("app").style.backgroundColor = "#000";
} else {
  document.getElementById("app").style.backgroundColor = "#fff";
}
let mywatch = watch(() => router.currentRoute.value.fullPath, (val) => {
  document.getElementById("app").style.removeProperty("background-color");
  mywatch()
})
